@import url("reset.css");
@import url('animate.css');
@import url('swiper.min.css');
@import url('lightgallery.css');
html {
	height:100%;
}
body {
	color:#333333;
	line-height:20px;
}
a {
	color:#333;
}
a:hover {
	color:#2397d4;
}
 @media (min-width:1367px) {
.w {
margin:0 auto;
width:1200px;
}
.topbar {
background:#f6f6f6;
color:#999;
font-size:12px;
line-height:40px;
}
 .topbar-welcome {
float:left;
background:url(../images/icontop01.png) no-repeat 0 center;
padding-left:30px;
}
 .topbar-welcome strong {
color:#008cd4;
font-weight:normal;
padding:0 5px;
}
 .topbar-links {
float:right;
}
 .topbar-links a {
color:#008cd4;
display:inline-block;
border-right:1px solid #eee;
padding:0 10px;
}
.head {
height:70px;
padding:40px 0;
}
 .head-logo {
float:left;
margin-right:20px;
}
 .head-slogen {
float:left;
}
 .head-slogen h1 {
font-size:28px;
line-height:30px;
}
 .head-slogen h1 strong {
color:#008cd7;
}
 .head-slogen span {
display:inline-block;
border:1px solid #666;
line-height:26px;
box-sizing:border-box;
padding:0 7px;
color:#666;
margin-bottom:12px;
}
 .head-contact {
float:right;
padding:5px 0;
}
 .head-contact dl {
float:left;
margin-left:10px;
}
 .head-contact-wechat {
position:relative;
}
 .head-contact-wechat dt {
border:2px solid #f6ab00;
}
 .head-contact-wechat dd {
position:absolute;
top:50%;
left:-120px;
transform:translateY(-50%);
opacity:0;
transition:all ease-out 0.3s;
}
 .head-contact-wechat dd img {
width:120px;
}
 .head-contact-wechat:hover dd {
opacity:1;
}
 .head-contact-tel {
position:relative;
padding-left:70px;
}
 .head-contact-tel dt {
position:absolute;
top:0;
left:0;
border:2px solid #f6ab00;
}
 .head-contact-tel dd {
}
 .head-contact-tel strong {
font-family:'Swis721 LtCn BT';
display:block;
font-size:24px;
line-height:30px;
white-space:nowrap;
}
.nav {
background:linear-gradient(to bottom, #008cd7 0, #008cd7 1px, #54b2e4 1px, #54b2e4 2px, #008cd7 2px, #008cd7 100%);
}
 nav span {
display:none;
}
 nav ul:after {
content:'';
display:block;
clear:both;
}
 nav li {
float:left;
position:relative;
}
 nav li a {
display:block;
font-size:16px;
line-height:60px;
padding:0 42px;
position:relative;
border-left:1px solid #4dafe3;
color:#fff;
}
 nav li.on>a, nav>li>a:hover, nav li a.on {
background:#f2ac24;
color:#fff;
}
 nav li.on>a:after, nav>li>a:hover:after, nav li a.on:after {
width:16px;
background:#2397d4;
}
 nav li ul {
display:none;
position:absolute;
z-index:9;
top:60px;
left:0;
background:#2397d4;
width:240px;
box-shadow:0 3px 3px rgba(0, 0, 0, 0.1);
}
 nav li li {
float:none;
margin-right:0;
}
 nav li li a {
font-size:14px;
border-top:1px solid rgba(255, 255, 255, 0.1);
line-height: 40px;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
}
 nav>ul>li ul li a:after {
content:'';
display:block;
position:absolute;
top:50%;
right:20px;
width:10px;
height:10px;
border-top:1px solid #fff;
border-right:1px solid #fff;
transform:translateY(-50%) rotate(45deg);
transition:all ease-out 0.3s;
}
 nav li li a:hover {
padding:0 35px;
background:#f2ac24;
color:#fff;
}
 nav li li ul {
display:none;
position:absolute;
top:0;
left:240px
}
 nav>ul>li ul li a:hover:after {
right:30px;
}
 .search {
padding:20px 0;
border-bottom:1px solid #eee;
}
.search:after {
content:'';
display:block;
clear:both;
}
 .search-companynews {
float:left;
width:600px;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
line-height:40px;
}
 .search-companynews span {
color:#008cd6;
}
 .search-companynews a {
margin-right:10px;
}
 .search-companynews time {
font-size:12px;
color:#999;
}
 .search-form {
float:right;
}
 .search-form form {
position:relative;
}
 .search-form input {
height:40px;
}
 .search-form input.txt {
width:380px;
height:40px;
box-sizing:border-box;
border:1px solid #ccc;
padding:0 10px;
}
 .search-form input::-webkit-input-placeholder {
color:rgba(0, 0, 0, 0.5);
}
 .search-form input.btn {
position:absolute;
top:0;
right:0;
width:40px;
height:40px;
background:url(../images/searchicon.png) no-repeat center center;
}
 footer {
background:#1e83ba url(../images/bg-foot.png) no-repeat center center;
}
 .foot-contact {
margin:0 -15px 40px;
padding-top:40px;
}
 .foot-contact div {
float:left;
width:380px;
margin:0 15px;
box-sizing:border-box;
padding:15px 0 15px 50px;
color:#fff;
line-height:24px;
border:1px solid rgba(255, 255, 255, 0.5);
position:relative;
}
 .foot-contact div span {
display:block;
}
 .foot-contact div i {
position:absolute;
top:15px;
left:15px;
display:block;
width:20px;
height:50px;
}
 .foot-contact-add i {
background:url(../images/icon-footadd.png) no-repeat center center;
}
 .foot-contact-tel i {
background:url(../images/icon-foottel.png) no-repeat center center;
}
 .foot-contact-email i {
background:url(../images/icon-footemail.png) no-repeat center center;
}
 .foot-logo {
text-align:center;
margin-bottom:20px;
}
 .foot-nav {
text-align:center;
margin-bottom:40px;
}
 .foot-nav a {
color:#fff;
font-size:16px;
padding:0 20px;
font-weight:bold;
}
 .copy {
padding:20px 0;
color:rgba(255, 255, 255, 0.5);
border-top:1px solid rgba(255, 255, 255, 0.2);
}
 .copy a {
color:rgba(255, 255, 255, 0.5);
}
 .copy-rights {
float:left;
}
 .copy-support {
float:right;
}
 .sidebar {
position:fixed;
z-index:2;
right:0;
top:50%;
}
 .sidebar div {
background:#008cd6;
color:#fff;
margin-bottom:2px;
cursor:pointer;
}
 .sidebar div a {
display:block;
color:#fff;
}
 .sidebar div i {
display:inline-block;
width:60px;
height:40px;
text-align:center;
}
 .sidebar div span {
display:block;
}
 .sidebarchat, .sidebarlink, .sidebartop {
width:60px;
height:60px;
padding:5px;
text-align:center;
}
 .sidebarchat:hover, .sidebartel:hover, .sidebarlink:hover, .sidebartop:hover {
background:#f6a900;
}
 .sidebar div.sidebarchat, .sidebar div.sidebartel, .sidebar div.sidebarlink {
padding:10px 5px;
height:50px;
position:relative;
}
 .sidebar div.sidebarchat {
animation:sidebarchatmc 1s infinite ease-in-out;
-moz-animation:sidebarchatmc 1s infinite ease-in-out;
-webkit-animation:sidebarchatmc 1s infinite ease-in-out;
-o-animation:sidebarchatmc 1s infinite ease-in-out;
}
 @keyframes sidebarchatmc {
 0% {
background:#f6a900;
}
 50% {
background:#008cd6;
}
 100% {
background:#f6a900;
}
}
 .sidebar div.sidebarchat i, .sidebar div.sidebartel i, .sidebar div.sidebarlink i {
position:absolute;
top:5px;
left:5px;
}
 .sidebar div.sidebarchat span, .sidebar div.sidebartel span, .sidebar div.sidebarlink span {
position:absolute;
display:inline-block;
width:60px;
bottom:5px;
left:5px;
}
 .sidebar div.sidebarchat dl, .sidebar div.sidebartel dl {
position:absolute;
z-index:-1;
top:0;
right:-208px;
white-space:nowrap;
transition:all ease-out 0.3s;
}
 .sidebar div.sidebarlink dl {
position:absolute;
z-index:-1;
bottom:0;
right:-496px;
transition:all ease-out 0.3s;
width:496px;
color:#333;
text-align:center;
}
 .sidebar div.sidebarchat dl {
width:120px;
text-align:center;
}
 .sidebar div.sidebartel dl {
width:180px;
text-align:center;
}
 .sidebar div.sidebarlink dl {
overflow:hidden;
}
 .sidebar div.sidebarchat dt, .sidebar div.sidebartel dt {
line-height:34px;
margin-bottom:2px;
background:#f6a900;
}
 .sidebar div.sidebarlink dt {
float:left;
margin-left:2px;
}
 .sidebar div.sidebarlink dt figure {
padding:4px;
background:#fff;
font-size:12px;
}
 .sidebar div.sidebarlink dt img {
height:114px;
}
 .sidebar div.sidebarchat dd, .sidebar div.sidebartel dd {
line-height:34px;
background:#f6a900;
}
 .sidebar div.sidebarchat:hover dl, .sidebar div.sidebartel:hover dl, .sidebar div.sidebarlink:hover dl {
right:72px;
}
}
@media (min-width:1025px) and (max-width:1366px) {
.w {
margin:0 auto;
width:1200px;
}
.topbar {
background:#f6f6f6;
color:#999;
font-size:12px;
line-height:40px;
}
 .topbar-welcome {
float:left;
background:url(../images/icontop01.png) no-repeat 0 center;
padding-left:30px;
}
 .topbar-welcome strong {
color:#008cd4;
font-weight:normal;
padding:0 5px;
}
 .topbar-links {
float:right;
}
 .topbar-links a {
color:#008cd4;
display:inline-block;
border-right:1px solid #eee;
padding:0 10px;
}
.head {
height:70px;
padding:40px 0;
}
 .head-logo {
float:left;
margin-right:20px;
}
 .head-slogen {
float:left;
}
 .head-slogen h1 {
font-size:28px;
line-height:30px;
}
 .head-slogen h1 strong {
color:#008cd7;
}
 .head-slogen span {
display:inline-block;
border:1px solid #666;
line-height:26px;
box-sizing:border-box;
padding:0 7px;
color:#666;
margin-bottom:12px;
}
 .head-contact {
float:right;
padding:5px 0;
}
 .head-contact dl {
float:left;
margin-left:10px;
}
 .head-contact-wechat {
position:relative;
}
 .head-contact-wechat dt {
border:2px solid #f6ab00;
}
 .head-contact-wechat dd {
position:absolute;
top:50%;
left:-120px;
transform:translateY(-50%);
opacity:0;
transition:all ease-out 0.3s;
}
 .head-contact-wechat dd img {
width:120px;
}
 .head-contact-wechat:hover dd {
opacity:1;
}
 .head-contact-tel {
position:relative;
padding-left:70px;
}
 .head-contact-tel dt {
position:absolute;
top:0;
left:0;
border:2px solid #f6ab00;
}
 .head-contact-tel dd {
}
 .head-contact-tel strong {
font-family:'Swis721 LtCn BT';
display:block;
font-size:24px;
line-height:30px;
white-space:nowrap;
}
.nav {
background:linear-gradient(to bottom, #008cd7 0, #008cd7 1px, #54b2e4 1px, #54b2e4 2px, #008cd7 2px, #008cd7 100%);
}
 nav span {
display:none;
}
 nav ul:after {
content:'';
display:block;
clear:both;
}
 nav li {
float:left;
position:relative;
}
 nav li a {
display:block;
font-size:16px;
line-height:60px;
padding:0 30px;
position:relative;
border-left:1px solid #4dafe3;
color:#fff;
}
 nav li.on>a, nav>li>a:hover, nav li a.on {
background:#f2ac24;
color:#fff;
}
 nav li.on>a:after, nav>li>a:hover:after, nav li a.on:after {
width:16px;
background:#2397d4;
}
 nav li ul {
display:none;
position:absolute;
z-index:9;
top:60px;
left:0;
background:#2397d4;
width:240px;
box-shadow:0 3px 3px rgba(0, 0, 0, 0.1);
}
 nav li li {
float:none;
margin-right:0;
}
 nav li li a {
font-size:14px;
border-top:1px solid rgba(255, 255, 255, 0.1);
line-height: 40px;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
}
 nav>ul>li ul li a:after {
content:'';
display:block;
position:absolute;
top:50%;
right:20px;
width:10px;
height:10px;
border-top:1px solid #fff;
border-right:1px solid #fff;
transform:translateY(-50%) rotate(45deg);
transition:all ease-out 0.3s;
}
 nav li li a:hover {
padding:0 35px;
background:#f2ac24;
color:#fff;
}
 nav li li ul {
display:none;
position:absolute;
top:0;
left:240px
}
 nav>ul>li ul li a:hover:after {
right:30px;
}
 .search {
padding:20px 0;
border-bottom:1px solid #eee;
}
.search:after {
content:'';
display:block;
clear:both;
}
 .search-companynews {
float:left;
width:600px;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
line-height:40px;
}
 .search-companynews span {
color:#008cd6;
}
 .search-companynews a {
margin-right:10px;
}
 .search-companynews time {
font-size:12px;
color:#999;
}
 .search-form {
float:right;
}
 .search-form form {
position:relative;
}
 .search-form input {
height:40px;
}
 .search-form input.txt {
width:380px;
height:40px;
box-sizing:border-box;
border:1px solid #ccc;
padding:0 10px;
}
 .search-form input::-webkit-input-placeholder {
color:rgba(0, 0, 0, 0.5);
}
 .search-form input.btn {
position:absolute;
top:0;
right:0;
width:40px;
height:40px;
background:url(../images/searchicon.png) no-repeat center center;
}
 footer {
background:#1e83ba url(../images/bg-foot.png) no-repeat center center;
}
 .foot-contact {
margin:0 -15px 40px;
padding-top:40px;
}
 .foot-contact div {
float:left;
width:380px;
margin:0 15px;
box-sizing:border-box;
padding:15px 0 15px 50px;
color:#fff;
line-height:24px;
border:1px solid rgba(255, 255, 255, 0.5);
position:relative;
}
 .foot-contact div span {
display:block;
}
 .foot-contact div i {
position:absolute;
top:15px;
left:15px;
display:block;
width:20px;
height:50px;
}
 .foot-contact-add i {
background:url(../images/icon-footadd.png) no-repeat center center;
}
 .foot-contact-tel i {
background:url(../images/icon-foottel.png) no-repeat center center;
}
 .foot-contact-email i {
background:url(../images/icon-footemail.png) no-repeat center center;
}
 .foot-logo {
text-align:center;
margin-bottom:20px;
}
 .foot-nav {
text-align:center;
margin-bottom:40px;
}
 .foot-nav a {
color:#fff;
font-size:16px;
padding:0 20px;
font-weight:bold;
}
 .copy {
padding:20px 0;
color:rgba(255, 255, 255, 0.5);
border-top:1px solid rgba(255, 255, 255, 0.2);
}
 .copy a {
color:rgba(255, 255, 255, 0.5);
}
 .copy-rights {
float:left;
}
 .copy-support {
float:right;
}
 .sidebar {
position:fixed;
z-index:2;
right:0;
top:50%;
}
 .sidebar div {
background:#008cd6;
color:#fff;
margin-bottom:2px;
cursor:pointer;
}
 .sidebar div a {
display:block;
color:#fff;
}
 .sidebar div i {
display:inline-block;
width:60px;
height:40px;
text-align:center;
}
 .sidebar div span {
display:block;
}
 .sidebarchat, .sidebarlink, .sidebartop {
width:60px;
height:60px;
padding:5px;
text-align:center;
}
 .sidebarchat:hover, .sidebartel:hover, .sidebarlink:hover, .sidebartop:hover {
background:#f6a900;
}
 .sidebar div.sidebarchat, .sidebar div.sidebartel, .sidebar div.sidebarlink {
padding:10px 5px;
height:50px;
position:relative;
}
 .sidebar div.sidebarchat {
animation:sidebarchatmc 1s infinite ease-in-out;
-moz-animation:sidebarchatmc 1s infinite ease-in-out;
-webkit-animation:sidebarchatmc 1s infinite ease-in-out;
-o-animation:sidebarchatmc 1s infinite ease-in-out;
}
 @keyframes sidebarchatmc {
 0% {
background:#f6a900;
}
 50% {
background:#008cd6;
}
 100% {
background:#f6a900;
}
}
 .sidebar div.sidebarchat i, .sidebar div.sidebartel i, .sidebar div.sidebarlink i {
position:absolute;
top:5px;
left:5px;
}
 .sidebar div.sidebarchat span, .sidebar div.sidebartel span, .sidebar div.sidebarlink span {
position:absolute;
display:inline-block;
width:60px;
bottom:5px;
left:5px;
}
 .sidebar div.sidebarchat dl, .sidebar div.sidebartel dl {
position:absolute;
z-index:-1;
top:0;
right:-208px;
white-space:nowrap;
transition:all ease-out 0.3s;
}
 .sidebar div.sidebarlink dl {
position:absolute;
z-index:-1;
bottom:0;
right:-372px;
transition:all ease-out 0.3s;
width:372px;
color:#333;
text-align:center;
}
 .sidebar div.sidebarchat dl {
width:120px;
text-align:center;
}
 .sidebar div.sidebartel dl {
width:180px;
text-align:center;
}
 .sidebar div.sidebarlink dl {
overflow:hidden;
}
 .sidebar div.sidebarchat dt, .sidebar div.sidebartel dt {
line-height:34px;
margin-bottom:2px;
background:#f6a900;
}
 .sidebar div.sidebarlink dt {
float:left;
margin-left:2px;
}
 .sidebar div.sidebarlink dt figure {
padding:4px;
background:#fff;
font-size:12px;
}
 .sidebar div.sidebarlink dt img {
height:114px;
}
 .sidebar div.sidebarchat dd, .sidebar div.sidebartel dd {
line-height:34px;
background:#f6a900;
}
 .sidebar div.sidebarchat:hover dl, .sidebar div.sidebartel:hover dl, .sidebar div.sidebarlink:hover dl {
right:72px;
}
}
@media (min-width:768px) and (max-width:1024px) {
body {
font-size:12px;
}
.topbar {
background:#f6f6f6;
color:#999;
font-size:12px;
line-height:40px;
}
 .topbar-welcome {
float:left;
background:url(../images/icontop01.png) no-repeat 0 center;
padding-left:30px;
}
 .topbar-welcome strong {
color:#008cd4;
font-weight:normal;
padding:0 5px;
}
 .topbar-links {
float:right;
}
 .topbar-links a {
color:#008cd4;
display:inline-block;
border-right:1px solid #eee;
padding:0 10px;
}
.head {
padding:20px;
}
 .head-logo {
float:left;
margin-right:20px;
}
 .head-slogen {
float:left;
}
 .head-slogen h1 {
font-size:28px;
line-height:30px;
}
 .head-slogen h1 strong {
color:#008cd7;
}
 .head-slogen span {
display:inline-block;
border:1px solid #666;
line-height:26px;
box-sizing:border-box;
padding:0 7px;
color:#666;
margin-bottom:12px;
}
 .head-contact {
display:none;
}
.nav {
position:relative;
z-index:4;
}
 nav span {
position:absolute;
z-index:3;
top:-85px;
right:20px;
display:block;
width:60px;
background:#f6a900;
padding:15px;
box-sizing:border-box;
animation:navspanmc 3s infinite ease-in-out;
-moz-animation:navspanmc 3s infinite ease-in-out;
-webkit-animation:navspanmc 3s infinite ease-in-out;
-o-animation:navspanmc 3s infinite ease-in-out;
}
 @keyframes navspanmc {
 0% {
background:#f6a900;
}
 50% {
background:#008cd4;
}
 100% {
background:#f6a900;
}
}
 nav span i {
display:block;
content:'';
width:100%;
height:2px;
background:#fff;
margin:6px 0;
transition:all 0.3s ease-out 0.1s;
}
 nav span.on i:nth-of-type(1) {
transform:translateY(8.5px) rotate(45deg);
}
 nav span.on i:nth-of-type(2) {
opacity: 0;
}
 nav span.on i:nth-of-type(3) {
transform:translateY(-8.5px) rotate(-45deg);
}
 nav ul {
position:absolute;
left:-100%;
top:150px;
width:100%;
background:#fff;
box-shadow:0 5px 5px rgba(0, 0, 0, 0.1);
transition:all ease-out 0.3s;
}
 nav ul.on {
left:0;
}
 nav ul li {
position:relative;
}
 nav ul li i {
position:absolute;
z-index:1;
top:0;
right:0;
width:40px;
height:40px;
background:#eee;
text-align:center;
line-height:40px;
font-style:normal;
}
 nav li a {
display:block;
line-height:40px;
font-size:14px;
padding:0 20px;
border-bottom:1px solid #eee;
}
 nav li a:hover {
background:#2397d4;
color:#fff;
}
 nav li ul {
display:none;
position:static;
overflow:hidden;
background:#f4f4f4;
box-shadow:none;
}
 nav li ul.on {
display:block;
}
 nav li li {
float:left;
width:50%;
}
 nav li li a {
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
font-size:12px;
color:#999;
}
.mask {
position:fixed;
z-index:3;
bottom:0;
left:-100%;
width:100%;
top:0;
background:rgba(0, 0, 0, 0.5);
transition:all ease-out 0.3s;
}
.mask.on {
left:0;
}
 .search {
padding:20px;
border-bottom:1px solid #eee;
}
.search:after {
content:'';
display:block;
clear:both;
}
 .search-companynews {
float:left;
width:300px;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
line-height:40px;
}
 .search-companynews span {
color:#008cd6;
}
 .search-companynews a {
margin-right:10px;
}
 .search-companynews time {
font-size:12px;
color:#999;
}
 .search-form {
float:right;
}
 .search-form form {
position:relative;
}
 .search-form input {
height:40px;
}
 .search-form input.txt {
width:380px;
height:40px;
box-sizing:border-box;
border:1px solid #ccc;
padding:0 10px;
}
 .search-form input::-webkit-input-placeholder {
color:rgba(0, 0, 0, 0.5);
}
 .search-form input.btn {
position:absolute;
top:0;
right:0;
width:40px;
height:40px;
background:url(../images/searchicon.png) no-repeat center center;
}
 footer {
background:#1e83ba url(../images/bg-foot.png) no-repeat center center;
padding:0 20px;
}
 .foot-contact {
margin:0 -1% 40px;
padding-top:40px;
}
 .foot-contact div {
float:left;
width:31.33%;
margin:0 1%;
box-sizing:border-box;
padding:15px;
color:#fff;
border:1px solid rgba(255, 255, 255, 0.5);
position:relative;
}
 .foot-contact div span {
display:block;
}
 .foot-contact div i {
display:block;
width:20px;
height:20px;
margin-bottom:5px;
}
 .foot-contact-add i {
background:url(../images/icon-footadd.png) no-repeat center center;
}
 .foot-contact-tel i {
background:url(../images/icon-foottel.png) no-repeat center center;
}
 .foot-contact-email i {
background:url(../images/icon-footemail.png) no-repeat center center;
}
 .foot-logo {
text-align:center;
margin-bottom:20px;
}
 .foot-nav {
text-align:center;
margin-bottom:40px;
}
 .foot-nav a {
color:#fff;
font-size:13px;
padding:0 15px;
font-weight:bold;
}
 .copy {
padding:20px 0;
color:rgba(255, 255, 255, 0.5);
border-top:1px solid rgba(255, 255, 255, 0.2);
}
 .copy a {
color:rgba(255, 255, 255, 0.5);
}
 .copy-rights {
float:left;
}
 .copy-support {
float:right;
}
 .sidebar {
position:fixed;
z-index:2;
right:0;
top:50%;
}
 .sidebar div {
background:#008cd6;
color:#fff;
margin-bottom:2px;
cursor:pointer;
}
 .sidebar div a {
display:block;
color:#fff;
}
 .sidebar div i {
display:inline-block;
width:60px;
height:40px;
text-align:center;
}
 .sidebar div span {
display:block;
}
 .sidebarchat, .sidebarlink, .sidebartop {
width:60px;
height:60px;
padding:5px;
text-align:center;
}
 .sidebarchat:hover, .sidebartel:hover, .sidebarlink:hover, .sidebartop:hover {
background:#f6a900;
}
 .sidebar div.sidebarchat, .sidebar div.sidebartel, .sidebar div.sidebarlink {
padding:10px 5px;
height:50px;
position:relative;
}
 .sidebar div.sidebarchat {
animation:sidebarchatmc 1s infinite ease-in-out;
-moz-animation:sidebarchatmc 1s infinite ease-in-out;
-webkit-animation:sidebarchatmc 1s infinite ease-in-out;
-o-animation:sidebarchatmc 1s infinite ease-in-out;
}
 @keyframes sidebarchatmc {
 0% {
background:#f6a900;
}
 50% {
background:#008cd6;
}
 100% {
background:#f6a900;
}
}
 .sidebar div.sidebarchat i, .sidebar div.sidebartel i, .sidebar div.sidebarlink i {
position:absolute;
top:5px;
left:5px;
}
 .sidebar div.sidebarchat span, .sidebar div.sidebartel span, .sidebar div.sidebarlink span {
position:absolute;
display:inline-block;
width:60px;
bottom:5px;
left:5px;
text-align:center;
}
 .sidebar div.sidebarchat dl, .sidebar div.sidebartel dl {
position:absolute;
z-index:-1;
top:0;
right:-208px;
white-space:nowrap;
transition:all ease-out 0.3s;
}
 .sidebar div.sidebarlink dl {
position:absolute;
z-index:-1;
bottom:0;
right:-372px;
transition:all ease-out 0.3s;
width:372px;
color:#333;
text-align:center;
}
 .sidebar div.sidebarchat dl {
width:120px;
text-align:center;
}
 .sidebar div.sidebartel dl {
width:180px;
text-align:center;
}
 .sidebar div.sidebarlink dl {
overflow:hidden;
}
 .sidebar div.sidebarchat dt, .sidebar div.sidebartel dt {
line-height:34px;
margin-bottom:2px;
background:#f6a900;
}
 .sidebar div.sidebarlink dt {
float:left;
margin-left:2px;
}
 .sidebar div.sidebarlink dt figure {
padding:4px;
background:#fff;
font-size:12px;
}
 .sidebar div.sidebarlink dt img {
height:114px;
}
 .sidebar div.sidebarchat dd, .sidebar div.sidebartel dd {
line-height:34px;
background:#f6a900;
}
 .sidebar div.sidebarchat:hover dl, .sidebar div.sidebartel:hover dl, .sidebar div.sidebarlink:hover dl {
right:72px;
}
}
@media (max-width:767px) {
body {
font-size:12px;
padding-bottom:60px;
}
.topbar {
text-align:center;
background:#f6f6f6;
color:#999;
padding:10px 5%;
}
 .topbar-welcome {
}
 .topbar-welcome strong {
color:#008cd4;
font-weight:normal;
padding:0 5px;
}
 .topbar-links {
}
 .topbar-links a {
color:#008cd4;
margin-left:10px;
}
.head {
text-align:center;
padding:20px;
}
 .head-logo {
margin-bottom:10px;
}
 .head-slogen {
}
 .head-slogen h1 {
font-size:18px;
}
 .head-slogen h1 strong {
color:#008cd7;
}
 .head-slogen span {
display:inline-block;
border:1px solid #666;
line-height:26px;
box-sizing:border-box;
padding:0 7px;
color:#666;
margin-bottom:6px;
}
 .head-contact {
display:none;
}
.nav {
position:relative;
z-index:4;
}
 nav span {
position:fixed;
z-index:3;
bottom:0;
left:0;
display:block;
width:20%;
background:#f6a900;
padding:5px 25px 25px;
box-sizing:border-box;
animation:navspanmc 3s infinite ease-in-out;
-moz-animation:navspanmc 3s infinite ease-in-out;
-webkit-animation:navspanmc 3s infinite ease-in-out;
-o-animation:navspanmc 3s infinite ease-in-out;
}
 @keyframes navspanmc {
 0% {
background:#f6a900;
}
 50% {
background:#008cd4;
}
 100% {
background:#f6a900;
}
}
 nav span:after {
content:'导航菜单';
clear:both;
position:fixed;
bottom:5px;
left:0;
width:20%;
text-align:center;
color:#fff;
text-align:center;
}
 nav span i {
display:block;
content:'';
width:100%;
height:2px;
background:#fff;
margin:6px 0;
transition:all 0.3s ease-out 0.1s;
}
 nav span.on i:nth-of-type(1) {
transform:translateY(8.5px) rotate(45deg);
}
 nav span.on i:nth-of-type(2) {
opacity: 0;
}
 nav span.on i:nth-of-type(3) {
transform:translateY(-8.5px) rotate(-45deg);
}
 nav ul {
position:fixed;
left:-100%;
bottom:60px;
width:100%;
background:#fff;
box-shadow:0 5px 5px rgba(0, 0, 0, 0.1);
transition:all ease-out 0.3s;
}
 nav ul.on {
left:0;
}
 nav ul li {
position:relative;
}
 nav ul li i {
position:absolute;
z-index:1;
top:0;
right:0;
width:40px;
height:40px;
background:#eee;
text-align:center;
line-height:40px;
font-style:normal;
}
 nav li a {
display:block;
line-height:40px;
font-size:14px;
padding:0 20px;
border-bottom:1px solid #eee;
}
 nav li a:hover {
background:#2397d4;
color:#fff;
}
 nav li ul {
display:none;
position:static;
overflow:hidden;
background:#f4f4f4;
box-shadow:none;
}
 nav li ul.on {
display:block;
}
 nav li li {
float:left;
width:50%;
}
 nav li li a {
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
font-size:12px;
color:#999;
}
.mask {
position:fixed;
z-index:3;
bottom:0;
left:-100%;
width:100%;
top:0;
background:rgba(0, 0, 0, 0.5);
transition:all ease-out 0.3s;
}
.mask.on {
left:0;
}
 .search {
padding:20px;
border-bottom:1px solid #eee;
}
.search:after {
content:'';
display:block;
clear:both;
}
 .search-companynews {
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
margin-bottom:5px;
}
 .search-form {
}
 .search-form form {
position:relative;
}
 .search-form input {
height:40px;
}
 .search-form input.txt {
width:100%;
height:40px;
box-sizing:border-box;
border:1px solid #ccc;
padding:0 10px;
}
 .search-form input::-webkit-input-placeholder {
color:rgba(0, 0, 0, 0.5);
}
 .search-form input.btn {
position:absolute;
top:0;
right:0;
width:40px;
height:40px;
background:url(../images/searchicon.png) no-repeat center center;
}
 .search-form form input:focus {
outline:none;
}
 footer {
background:#1e83ba url(../images/bg-foot.png) no-repeat center center;
}
 .foot-contact {
padding:20px;
}
 .foot-contact div {
margin:0 0 10px;
box-sizing:border-box;
padding:10px 0 10px 50px;
color:#fff;
line-height:24px;
border:1px solid rgba(255, 255, 255, 0.5);
position:relative;
}
 .foot-contact div span {
display:block;
}
 .foot-contact div i {
position:absolute;
top:15px;
left:15px;
display:block;
width:20px;
height:40px;
}
 .foot-contact-add i {
background:url(../images/icon-footadd.png) no-repeat center center;
}
 .foot-contact-tel i {
background:url(../images/icon-foottel.png) no-repeat center center;
}
 .foot-contact-email i {
background:url(../images/icon-footemail.png) no-repeat center center;
}
 .foot-logo {
text-align:center;
margin-bottom:10px;
}
 .foot-nav {
text-align:center;
margin-bottom:20px;
padding:0 5%;
}
 .foot-nav a {
color:#fff;
padding:0 10px;
font-weight:bold;
}
 .copy {
padding:20px 0;
color:rgba(255, 255, 255, 0.5);
border-top:1px solid rgba(255, 255, 255, 0.2);
text-align:center;
}
 .copy a {
color:rgba(255, 255, 255, 0.5);
}
 .copy-rights span {
display:block;
}
 .copy-support {
}
 .sidebar {
position:fixed;
z-index:2;
right:0;
left:20%;
bottom:0;
}
 .sidebar div {
float:left;
background:#008cd6;
color:#fff;
cursor:pointer;
width:25%;
}
 .sidebar div a {
display:block;
color:#fff;
}
 .sidebar div i {
display:inline-block;
width:100%;
height:30px;
text-align:center;
}
 .sidebar div i img {
height:30px;
}
 .sidebar div span {
display:block;
}
 .sidebarchat, .sidebarlink, .sidebartop {
width:60px;
text-align:center;
padding:5px 0;
position:relative;
}
 .sidebarchat:hover, .sidebartel:hover, .sidebarlink:hover, .sidebartop:hover {
background:#f6a900;
}
 .sidebar div.sidebartel {
padding:5px 0;
height:50px;
position:relative;
}
 .sidebar div.sidebartel i {
position:absolute;
top:5px;
left:0;
}
 .sidebar div.sidebartel span {
position:absolute;
display:inline-block;
width:100%;
bottom:5px;
left:0;
text-align:center;
}
 .sidebar div.sidebarchat dl {
position:absolute;
z-index:2;
bottom:-61px;
left:0;
white-space:nowrap;
transition:all ease-out 0.3s;
font-weight:bold;
}
 .sidebar div.sidebartel dl {
position:absolute;
z-index:2;
bottom:-124px;
left:0;
white-space:nowrap;
transition:all ease-out 0.3s;
font-weight:bold;
}
 .sidebar div.sidebarlink dl {
position:absolute;
z-index:2;
bottom:-111px;
left:-38px;
white-space:nowrap;
transition:all ease-out 0.3s;
font-weight:bold;
text-align:center;
width:368px;
transform:translateX(-50%);
}
 .sidebar div.sidebarlink dt {
float:left;
margin:0 1px;
}
 .sidebar div.sidebarlink dl figure {
background:#fff;
padding:5px;
color:#333;
}
 .sidebar div.sidebarlink dl figure img {
height:80px;
}
 .sidebar div.sidebarchat dl {
width:100px;
text-align:center;
}
 .sidebar div.sidebartel dl {
text-align:center;
}
 .sidebar div.sidebarchat dt, .sidebar div.sidebartel dt {
font-size:14px;
background:#f6a900;
padding:5px;
margin-bottom:1px;
white-space:nowrap;
}
 .sidebar div.sidebarchat dd, .sidebar div.sidebartel dd {
font-size:14px;
background:#f6a900;
padding:5px;
}
 .sidebar div.sidebarchat:hover dl, .sidebar div.sidebartel:hover dl, .sidebar div.sidebarlink:hover dl {
bottom:61px;
}
}